<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JavaScript中事件</title>
</head>
<body>
    <table>
        <tr>
            <td>用户名</td>
            <td><input type="text" id="username" value="" onchange="checkUserName()"/><span id="afterUser"></span></td>
        </tr>
        <tr>
            <td>密码</td>
            <td><input type="text" id="password" value=""/></td>
        </tr>
        <tr>
            <td colspan="2"><button onclick="myClick()">点击我弹出用户名和密码信息</button></td>
        </tr>
    </table>
</body>
<script>
    function myClick(){
        var username=document.getElementById("username").value;
        var password=document.getElementById("password").value;
        alert("用户名："+username+","+"密码："+password);
    }
    function checkUserName(){
        var username=document.getElementById("username").value;
        if(username=="admin"){
            document.getElementById("afterUser").innerHTML="×，您输入用户名已经存在";
        }else{
            document.getElementById("afterUser").innerHTML="√，您输入用户名可以使用";
        }
    }
</script>
</html>